<template>
	<view>
		<view class="box">
			<!-- <view class="time">支付剩余时间 29:16</view> -->
			<view class="money" v-if="state==2"><text>￥</text>{{money}}</view>
			<view class="title" v-if="state==1">全平台通用3元x8张优惠券</view>
			<view class="title" v-if="state==2">餐饮安全承诺商家保证金</view>
			<view class="pay" @click="pay">确认支付</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				state: 0,
				order_sn: '',
				app: getApp().globalData,
				money:'0.00'
			}
		},
		onLoad(e) {
			this.state = e.state
			this.order_sn = e.order_sn
		},
		onShow() {
			this.money=uni.getStorageSync('moneys')
		},
		methods: {
			pay() {
				this.app.post('/api/user/shop_youzhi_pay', {
					order_sn: this.order_sn
				}).then(res => {
					console.log(res)
					uni.requestPayment({
						appId: res.pay_param.appId,
						nonceStr: res.pay_param.nonceStr,
						package: res.pay_param.package,
						paySign: res.pay_param.paySign,
						signType: res.pay_param.signType,
						timeStamp: res.pay_param.timeStamp,
						success: (e) => {
							uni.switchTab({
								url: '/pages/lcMy/lcMy'
							})
						},
						fail: (e) => {
							uni.showToast({
								title: '取消支付',
								icon: "none"
							})
							setTimeout(() => {
								uni.switchTab({
									url: '/pages/lcMy/lcMy'
								})
							}, 1500)
						}
					})
				})
			}
		}
	}
</script>

<style lang="scss">
	.box {
		width: 750rpx;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;

		.time {
			width: 100%;
			text-align: center;
			font-size: 30rpx;
			color: #333333;
			margin-top: 160rpx;
		}

		.money {
			width: 100%;
			text-align: center;
			font-size: 70rpx;
			color: #333333;
			font-weight: bold;
			margin-top: 200rpx;

			text {
				font-size: 40rpx;
			}
		}

		.title {
			width: 100%;
			text-align: center;
			font-size: 30rpx;
			color: #999999;
			margin-top: 10rpx;
		}

		.pay {
			width: 334rpx;
			height: 80rpx;
			background-color: #84BD00;
			color: #FFFFFF;
			display: flex;
			justify-content: center;
			align-items: center;
			border-radius: 16rpx;
			font-size: 30rpx;
			margin-top: 257rpx;
		}
	}
</style>